<template>
  <div class="userDebitList" v-loading="tableLoading">
    <AreaTitleWarp :title="'借贷订单列表'"></AreaTitleWarp>

    <!-- 借贷查询结果 -->
    <AreaWarp :padding="false">
      <el-table
        size="mini"
        :data="tableInfo"
        style="width: 100%"
        class="pub-table"
        header-row-class-name="pub-table-header-row"
        header-cell-class-name="pub-table-header-cell"
        tooltip-effect="dark"
      >
        <el-table-column prop="id" label="订单号" min-width="120"></el-table-column>
        <el-table-column
          prop="applyTime"
          label="申请时间"
          min-width="120"
          :formatter="formatter_timeYMDHM"
        ></el-table-column>
        <el-table-column prop="capital" label="申请金额"></el-table-column>
        <el-table-column prop="realCapital" label="借贷本金" min-width="120"></el-table-column>
        <el-table-column
          prop="status"
          label="订单状态"
          min-width="180"
          :formatter="formatter_orderStatus"
        ></el-table-column>
        <el-table-column prop="overdueDays" label="逾期天数" min-width="180"></el-table-column>
        <el-table-column prop="leftTotal" label="待还款金额" min-width="180"></el-table-column>
        <el-table-column prop="applyId" label="查看" min-width="120">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="orderDetails(scope.row)">订单详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    </AreaWarp>
  </div>
</template>
<script>
export default {
  props: ["queryMsg", "message"],
  data() {
    return {
      tableInfo: null,
      tableLoading: false
    };
  },
  methods: {
    getDebitInfo() {
      let that = this;
      that.tableLoading = true;
      that.ajaxJson({
        url: "/user/borrowList",
        data: {
          userId: that.queryMsg.userId
        },
        success: function(data) {
          if (data.code == "0") {
            that.tableInfo = data.data;
          }
          that.tableLoading = false;
        }
      });
    },
    orderDetails(row) {
      let that = this;
      let obj = {
        tabOptions:
          "orderDetails_" + that.queryMsg.realName + "-" + row.id + "-订单详情",
        queryMsg: { method: "add", id: row.applyId, userId: row.userId }
      };
      that.$store.dispatch("orderDetailsObjChange", obj);
    }
  },
  created() {
    let that = this;
    that.getDebitInfo();
  }
};
</script>
<style lang="less">
.userDebitList {
  padding-top: 20px;
}
</style>

